<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>判断一个点是否在区域范围内</title>

<script type="text/javascript" src="http://app.mapabc.com/apis?&t=flashmap&v=2.3.4&key=575b1c6603da50402ccaed009d1abdfa6a5cc0a468ebf84b7204870f06a84c69b5a36fb313bc21e0"></script>

<script type="text/javascript">
var mapObj=null;
function  mapInit() {
	var mapoption = new MMapOptions();
	mapoption.toolbar = ROUND; //设置地图初始化工具条，ROUND:新版圆工具条
	mapoption.toolbarPos=new MPoint(20,20); //设置工具条在地图上的显示位置
	mapoption.overviewMap = SHOW; //设置鹰眼地图的状态，SHOW:显示，HIDE:隐藏（默认）
	mapoption.scale = SHOW; //设置地图初始化比例尺状态，SHOW:显示（默认），HIDE:隐藏。
	mapoption.zoom = 13;//要加载的地图的缩放级别
	mapoption.center = new MLngLat(121.391569,31.233888);//要加载的地图的中心点经纬度坐标
	mapoption.language = MAP_CN;//设置地图类型，MAP_CN:中文地图（默认），MAP_EN:英文地图
	mapoption.fullScreenButton = SHOW;//设置是否显示全屏按钮，SHOW:显示（默认），HIDE:隐藏
	mapoption.centerCross = SHOW;//设置是否在地图上显示中心十字,SHOW:显示（默认），HIDE:隐藏
	mapoption.mapComButton = 0;//设置地图右上角的组件是否显示，SHOW:显示（默认），HIDE:隐藏。
	mapoption.requestNum=100;//设置地图切片请求并发数。默认100。
	mapObj = new MMap("map", mapoption); //地图初始化
}
var markerLngX;var markerlatY;var areaId;
function mouseMarker(){
	mapObj.removeClosuresListeners();
	mapObj.removeOverlaysByType(MOverlay.TYPE_MARKER);
	mapObj.addEventListener(mapObj,ADD_OVERLAY,function(){
		var arr = mapObj.getOverlaysByType(MOverlay.TYPE_MARKER);
		if(arr.length==0){
			return ;
		}
		if(arr.length==1){mapObj.setCurrentMouseTool(PAN_WHEELZOOM);}
		if(arr[0].TYPE==MOverlay.TYPE_MARKER){
			markerLngX=arr[0].lnglat.lngX;
			markerlatY=arr[0].lnglat.latY;
		}
		});
	var markerOption=new MMarkerOptions();//点选项
	markerOption.imageUrl="http://code.mapabc.com/images/lan_1.png";
	markerOption.canShowTip= false;
	markerOption.hasShadow=true;
	mapObj.setDefaultMarkerOption(markerOption);
	mapObj.setCurrentMouseTool(ADD_MARKER);
}
function mouseCircle(){
	//mapObj.removeOverlayById(areaId);
	mapObj.removeClosuresListeners();
	mapObj.addEventListener(mapObj,ADD_OVERLAY,function(){
		mapObj.setCurrentMouseTool(PAN_WHEELZOOM);
		var arr=mapObj.getOverlaysByType(MOverlay.TYPE_CIRCLE);
		if(arr.length==0){
			return ;
		}
		areaId=arr[0].id;
		var region = arr[0].bounds.southWest.lngX+","+arr[0].bounds.southWest.latY+","+arr[0].bounds.northEast.lngX+","+arr[0].bounds.northEast.latY;
		var regionXY=new Array();
		var arr1 = region.split(",");
		for(var i = 0 ;i<arr1.length;i=i+2){
				var mll =new MLngLat(arr1[i],arr1[i+1]);
				regionXY.push(mll);
		}
		var poiXY1 = new MLngLat(markerLngX,markerlatY);
		var regionXY2=new MLngLats(regionXY);
		var mss = new MSpatialSearch();
		var opt = new MSpatialSearchOptions();
		mss.setCallbackFunction(isRegion_CallBack);
		mss.isPoiInRegion(MOverlay.TYPE_CIRCLE,poiXY1,regionXY2,opt);
	});
	mapObj.setCurrentMouseTool(DRAW_CIRCLE);
}
function isRegion_CallBack(data){
	var resultStr="";
	if(data.error_message != null){
		resultStr="查询异常！"+data.error_message;
	}else{
	var content = "";
	switch(data.message){
	case 'ok':
		var rs = data.Result.split(";");
		if(rs.length==0){
			resultStr+="无结果";
		}else{
			for(var i=0;i<rs.length-1;i++){
				resultStr += "判断结果1："+getText(rs[i])+"<br />";
			}
		}
	break;
		case 'error':
			resultStr= "<div class=\"default\"><div class=\"default_title\">网络忙！请重新尝试！</div><div class=\"d_link\"><div class=\"d_right\"></div><div class=\"suggest\"><strong>建议：</strong><br />如果您刷新页后仍无法显示结果，请过几分钟后再次尝试或者与我们的服务人员联系。<br />Email：service@mapabc.com <br />电话：400 810 0080</div></div></span>错误信息："+data.message+"</div>";
		break;
		default:
			resultStr= "<div class=\"default\"><div class=\"default_title\">对不起！网络繁忙！请稍后重新尝试！</div><div class=\"d_link\"><div class=\"d_right\"></div><div class=\"suggest\"><strong>建议：</strong><br />如果您刷新页后仍无法显示结果，请过几分钟后再次尝试或者与我们的服务人员联系。<br />Email：service@mapabc.com <br />电话：400 810 0080</div></div></span>错误信息："+data.message+"</div>";
		}
	}
	document.getElementById("result").innerHTML = resultStr;
}
function getText(param){
	if(param=="INTERIOR"){return "区域内";}
	if(param=="EXTERIOR"){return "区域外";}
	if(param=="BOUNDARY"){return "区域边界上";}
}
function mouseRectangle(){
	//mapObj.removeOverlayById(areaId);
	mapObj.removeClosuresListeners();
	mapObj.addEventListener(mapObj,ADD_OVERLAY,function(){
		mapObj.setCurrentMouseTool(PAN_WHEELZOOM);
		var arr=mapObj.getOverlaysByType(MOverlay.TYPE_RECTANGLE);
		if(arr.length==0){
			return ;
		}
		areaId=arr[0].id;
		var regionXY=new Array();
		for(var j=0;j<arr[0].lnglatArr.length;j++){
			regionXY.push(new MLngLat(arr[0].lnglatArr[j].lngX,arr[0].lnglatArr[j].latY));
		}
		//var mll =new MLngLat(116.3084014,39.9640344);
		//var mll1 =new MLngLat(116.4599165,39.8583246);

		//regionXY.push(mll);regionXY.push(mll1);
		var poiXY1 = new MLngLat(markerLngX,markerlatY);
		var regionXY2=new MLngLats(regionXY);
		var mss = new MSpatialSearch();
		var option = new MSpatialSearchOptions();
		mss.setCallbackFunction(isRegion_CallBack);
		mss.isPoiInRegion(MOverlay.TYPE_RECTANGLE,poiXY1,regionXY2,option);
	});
	mapObj.setCurrentMouseTool(DRAW_RECTANGLE);
}
function mousePolygon(){
	//mapObj.removeOverlayById(areaId);
	mapObj.removeClosuresListeners();
	mapObj.addEventListener(mapObj,ADD_OVERLAY,function(){
		mapObj.setCurrentMouseTool(PAN_WHEELZOOM);
		var arr=mapObj.getOverlaysByType(MOverlay.TYPE_POLYGON);
		if(arr.length==0){
			return ;
		}
		var index=arr.length-1;
		areaId=arr[index].id;
		var regionXY=new Array();
		var vertexesStr="";
		for(var j=0;j<arr[index].lnglatArr.length;j++){
			regionXY.push(new MLngLat(arr[index].lnglatArr[j].lngX,arr[index].lnglatArr[j].latY));
			vertexesStr+=arr[index].lnglatArr[j].lngX+","+arr[index].lnglatArr[j].latY+",";
		}
		//alert(vertexesStr);
		document.getElementById("vertexes").value = vertexesStr;
		var poiXY1 = new MLngLat(markerLngX,markerlatY);
		var regionXY2=new MLngLats(regionXY);
		var mss = new MSpatialSearch();
		var option = new MSpatialSearchOptions();
		mss.setCallbackFunction(isRegion_CallBack);
		mss.isPoiInRegion(MOverlay.TYPE_POLYGON,poiXY1,regionXY2,option);
	});
	mapObj.setCurrentMouseTool(DRAW_POLYGON);
}

// 还原多边形
function revertPolygon(){
	var arr=mapObj.getOverlaysByType(MOverlay.TYPE_POLYGON);
	var index=arr.length;
	areaId="polygon"+index;
	var vertexesStr=document.getElementById("vertexStr").value;
	var vertexesArray = vertexesStr.split(",");
	
	// 将多边形顶点字符串还原成顶点数组
	var x=0;var y=0;
	var arr=new Array();
	for(var j=0;j<vertexesArray.length;j++){
		if(j%2==0){
			x=Number(vertexesArray[j]);
		}else{
			y=Number(vertexesArray[j]);
			arr.push(new MLngLat(x,y));
		}
	}
	
	var lineopt = new MAreaStyle();
　　//多边形的样式
　　lineopt.borderStyle.alpha = 1; //透明度，默认1，范围0~1 
	lineopt.borderStyle.color = 0xFF3300; //线颜色，默认黑色
　　lineopt.borderStyle.thickness = 3;  //线粗细度，默认3
　　//填充色
　　lineopt.fillStyle.color = 0xFF6600;
　　//tip样式
　　var tipOption = new MTipOptions();
　　tipOption.title="title";
　　tipOption.content="content";  //tip内容
　　tipOption.hasShadow= false; //是否有阴影
	// Polygon的参数选项
　　var areopt = new MAreaOptions();
　　areopt.areaStyle=lineopt;
　　areopt.tipOption=tipOption;
　　areopt.canShowTip = true;
	
　　var polygonAPI = new MPolygon(arr,areopt);
	polygonAPI.id=areaId;
	mapObj.addOverlay(polygonAPI,true);
}

// 设置地图中心点
function setCenter(){    
	var city=document.getElementById("city").value;
	var maptools=new MMapTools(mapObj);
	maptools.setCenterByCity(city);
}

var isStartup = true;
// 启用鼠标点击地图获取经纬度功能
function startup(){
	if(isStartup){
		isStartup = false;
		document.getElementById("button1").value="停用";
		mapObj.addEventListener(mapObj,MOUSE_CLICK,MclickMouse);//鼠标点击事件
	}else{
		isStartup = true;
		document.getElementById("button1").value="启用";
		mapObj.removeEventListener(mapObj,MOUSE_CLICK,MclickMouse);
	}
}

// 鼠标点击地图获取经纬度
function MclickMouse(param){
	document.getElementById("mapX").value=param.eventX;
	document.getElementById("mapY").value=param.eventY;
}

// 清除所有区域
function clearAllAreas(){
	mapObj.removeOverlaysByType(MOverlay.TYPE_POLYGON);
}
</script>
</head>
<body onload="mapInit();">
<table width="989"  border="0" cellpadding="0" cellspacing="2" bgcolor="#DDDDDD">
	<tr height="100%">
		<td rowspan="2" style="width:750px;height:600px;"><div id="map" style="height:600px; width:750px"></div></td>
		<td style="width:247px;border-left:1px solid #666;" valign="top" >
			<div style="padding:5px 0px 0px 5px;font-size:12px;height:290px">
				<div>
判断一个点是否在区域范围内<br/>
先画点：<input type="button" onclick="mouseMarker();" value="鼠标画点"/><br/><br/>
再画区域范围进行判断：<br/><input type="button" onclick="mousePolygon()" value="鼠标画多边形判断" style="width:130px"/> <input type="button" onclick="clearAllAreas()" value="清除所有区域" style="width:100px"/></div>
				<div id="result" name="result" style="height:30px;width:247px;margin-top:5px"></div>
				<div>所画多边形各顶点坐标如下：<br/><input type="text" id="vertexes" name="vertexes" style="width:300px"/><br/><br/>多边形各顶点坐标：<br/><input type="text" id="vertexStr" name="vertexStr" style="width:300px"/><br/><input type="button" onclick="revertPolygon()" value="根据顶点坐标显示多边形区域" style="width:190px"/><br/><br/>
城市名称或城市号：<input type="text" name="city" id="city" value="上海"/><br/><input type="button" value="设置地图中心点" onclick="setCenter()"/><br/><br/><br/><br/><input type="button" name="button1" id="button1" onclick="startup()" value="启用" style="width:45px"/>鼠标点击地图获取经纬度功能<br/><br/>
在地图上单击获取地图坐标：<br/> X:<input type="text" name="mapX" id="mapX" value="" style="width:80px"> Y:<input type="text" name="mapY" id="mapY" value="" style="width:80px"></div>
		   </div>
	   </td>
   </tr>
</table>
</body>
</html>